<!--conf
<sample in_favorites="false">
               <product version="1.4" edition="std"/>
                       <modifications>
                               <modified date="070101"/>
                       </modifications>
               <sampledescription><![CDATA[The easiest way to get your tabular data appear good looking is to automatically convert HTML table into dhtmlxGrid view. No scripting necessary - just include one javascript file from dhtmlxGrid library.]]></sampledescription></sample>
 --> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
	<title>Initialization from HTML table</title>
	
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<link rel="stylesheet" type="text/css" href="../../../codebase/dhtmlx.css"/>
	<script src="../../../codebase/dhtmlx.js"></script>
	<script>
		dhtmlx.skin = "dhx_skyblue";
	</script>
</head>
<body>
	<h1>Initialization Grid from HTML table</h1>
	<p>A table can be converted to the grid by <strong>dhtmlXGridFromTable </strong>command:</p>
	<div><a href="javascript:void(0)" onClick="new dhtmlXGridFromTable('tblToGrid');this.style.display='none';">Convert table to grid</a></div>
	<table id="tblToGrid" name="grid1" gridHeight="auto" style="width:400px" imgpath="../../../codebase/imgs/" border="1" lightnavigation="true">
		<tr>
			<td type="ro">Column 1</td>
			<td>Column 2</td>
		</tr>
		<tr>
			<td>value 11</td>
			<td>value 12</td>
		</tr>
		<tr>
			<td>value 21</td>
			<td>value 22</td>
		</tr>
		<tr>
			<td>value 31</td>
			<td>value 32</td>
		</tr>
		<tr>
			<td>value 41</td>
			<td>value 42</td>
		</tr>
		<tr>
			<td>value 51</td>
			<td>value 52</td>
		</tr>
	</table>
<br>


<p>Automatic initialization.</p>
<p>
		<div>Initialize automatically  from table the class attribute of which is set to "dhtmlxGrid"</div>
	</p>
<p> The initialization by a CSS class will work only for those tables that were on page at the moment of loading.</p>
	<table class="dhtmlxGrid" gridHeight="auto" name="grid2" imgpath="../../../codebase/imgs/" style="width:400px" lightnavigation="true">
  <tr>
			<td type="ro">Column 1</td>
			<td>Column 2</td>
		</tr>
		<tr>
			<td>value 11</td>
			<td>value 12</td>
		</tr>
		<tr>
			<td>value 21</td>
			<td>value 22</td>
		</tr>
		<tr>
			<td>value 31</td>
			<td>value 32</td>
		</tr>
		<tr>
			<td>value 41</td>
			<td>value 42</td>
		</tr>
		<tr>
			<td>value 51</td>
			<td>value 52</td>
		</tr>
	</table>
</body>
</html>
